<script setup>
    
import BasePage from "./BasePage.vue"
import ShelfTable from "../components/ShelfTable.vue"
import AddShelf from "@/components/AddShelf.vue"
import {ref, reactive} from 'vue'
import { getShelfList } from "../api/api.js"

const tableData = ref()
const addShelfRef = ref(null)

const click = () => {
    addShelfRef.value.dialogFormVisible = true
}

const getdata = () => {
    getShelfList().then(function (response) {
        tableData.value = response.data
    })
    .catch(function (error) {
    })
    .finally(function () {
        // 总是会执行
    });
}
getdata()

function refresh() {
    setTimeout(() => {
        getdata()
    }, 1000);
}
</script>

<template>
    <!-- <BasePage> -->
        <AddShelf ref="addShelfRef" @refreshShelf="refresh"></AddShelf>
        <el-button @click="click" type="primary">新增料架</el-button>
        <ShelfTable :tableData="tableData" @refreshShelf="refresh"/>
    <!-- </BasePage> -->
</template>
